<template>
	<view class="content">
		<projectSelect @go='go'></projectSelect>
		<view class="section-0">
			<view class="section-body">
				<view class="wrapper"  v-for="item in list" :key="item.name">
					<view class="title">{{item.name}}<view style="color: #0535d6;" class="iconfont icon-bianji"></view></view>
					<view class="value l-value">
						<view class="textarea">
							<u--textarea
								:maxlength="-1"
								placeholderClass="textarea-placeholder"
								class="textarea-body"
							    :placeholder="'请填写' + item.name + '...'"
							    v-model="item.content"
								border='null'
							  ></u--textarea>
						</view>
					</view>
				</view>
			</view>
			
		</view>
		<view class="footer-space"></view>
		<view class="footer">
			<view class="record">
				<view class="iconfont icon-lishijilu_huaban"></view>
				<text>历史记录</text>
			</view>
			<view class="submit" @click="submit()">
				提交检查
			</view>
		</view>
	</view>
</template>

<script>
	import { reportAddApi } from '@/api/statistics.js'
	import { mapGetters } from 'vuex';
	import projectSelect from '@/components/project_select/index.vue'
	export default {
		components: {projectSelect},
		data() {
			return {
				list: [
					{name: '工程进度情况', content: '', type: 'project_jd'},
					{name: '本周完成工作', content: '', type: 'this_week_work'},
					{name: '下周工作计划', content: '', type: 'next_week_plan'},
					{name: '本周重点管理工作', content: '', type: 'this_week_main'},
					{name: '下周重点管理工作', content: '', typ: 'next_week_main'},
					{name: '物资类存在或需要协调问题', content: '', type: 'wz_problem'},
					{name: '停电类存在或需要协调问题', content: '', type: 'td_problem'},
					{name: '政处类存在或需要协调问题', content: '', type: 'zc_problem'},
					{name: '其他类存在或需要协调问题', content: '', type: 'other_problem'},
				],
			}
		},
		computed: {
			...mapGetters({
				curProject: 'system/getCurProject',
				userInfo: 'system/getUserInfo',
			})
		},
		methods: {
			go(url) {
				uni.navigateTo({
					url
				})
			},
			submit() {
				let obj = {};
				this.list.forEach(item => {
					obj[item.type] = item.content;
				})
				obj.project_id = this.curProject.id
				obj.user_name = this.userInfo.user_name
				uni.showLoading({
					title: '提交中'
				})
				reportAddApi(obj).then((res) => {
					uni.hideLoading();
					uni.showToast({
						title: '提交成功', duration: 1000, icon: 'success'
					})
				}).catch(() => {
					uni.showToast({
						title: '提交失败', duration: 1000, icon: 'success'
					})
					uni.hideLoading();
				})
			}
		}
	
	}
</script>

<style lang="scss">
	.section-0{
		background-color: #1534ce;
		.section-body{
			padding-top: 35rpx;
			background-color: #fff;
			border-top-left-radius: 50rpx;
			border-top-right-radius: 50rpx;
			overflow: hidden;
		}
	}
	.footer-space{
		height: 150rpx;
	}
	.footer{
		
			width: 100%;
			height: 150rpx;
			background-color: #ffffff;
			position: fixed;
			bottom:0;
			left: 0;
			display: flex;
			justify-content: space-around;
			align-items: center;
			box-shadow: 0 0 20rpx 10rpx rgba(#bcbcb5, 0.17);
			.record{
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: column;
				.icon-lishijilu_huaban{
					font-size: 43rpx;
					color: #3b3c40;
				}
				text{
					font-size: 26rpx;
					color: #3b3c40;
					margin-top: 10rpx;
				}
			}
			.submit{
				width: 287rpx;
				height: 83rpx;
				background-color: #1534ce;
				border-radius: 20rpx;
				letter-spacing: 14rpx;
				color: #ffffff;
				font-size: 26rpx;
				display: flex;
				justify-content: center;
				align-items: center;
			}
		
	}
	.wrapper{
		margin-bottom: 28rpx;
		width: 670rpx;
		margin-left: 40rpx;
		border-radius: 35rpx;
		background-size: cover;
		background-repeat: no-repeat;
		border-radius: 50rpx;
		overflow: hidden;
		box-sizing: border-box;
		box-shadow: 0 0 20rpx 10rpx rgba(#bcbcb5, 0.17);
		padding: 28rpx 40rpx;
		.title{
			width: 100%;
			height: 30rpx;
			line-height: 30rpx;
			border-bottom: solid 3rpx #f2f2f0;
			font-size: 26rpx;
			font-stretch: normal;
			letter-spacing: 0rpx;
			color: #7f98ae;
			padding-bottom: 15rpx;
			.iconfont{
				float: right;
				font-size: 30rpx;
				color: #9b9b9b;
			}
		}
		.value{
			float: left;
			width: 445rpx;
			.textarea{
				width: 100%;
				height: 300rpx;
				line-height: 30rpx;
				.textarea-body{
					box-sizing: border-box;
					width: 100%;
					height: 300rpx;
					border: none;
					padding: 18rpx 0rpx!important;
					font-weight: normal;
					font-stretch: normal;
					letter-spacing: 0rpx;
					/deep/ .u-textarea__field{
						height: auto!important;
						font-size: 25rpx;
					}
				}
				/deep/ .u-textarea--disabled{
					background-color: #fff;
				}
											
				.textarea-placeholder{
					font-size: 25rpx;
					font-weight: normal;
					font-stretch: normal;
					line-height: 50rpx;
					letter-spacing: 3rpx;
					color: rgba(0,0,0,0.5);
				}
			}
		}
		.l-value{
			width: 100%;
		}
		
	}
</style>
